--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
Node / ReticulumProjects / MeshChatX.git / files / meshchatx / src / frontend / components / LanguageSelector.vue
Displaying Raw • Download
meshchatx/src/frontend/components/LanguageSelector.vue 4bd787ccd70a459a02eececca3f942f0e64ec4ce (4bd787cc) Text, 5.46 KB
T8b949e<!-- SPDX-License-Identifier: 0BSD -->
Tb4b4b4<Tff7b72templateTb4b4b4>
Tb4b4b4<Tff7b72div Te6edf3classTff7b72=Ta5d6ff"relative"Tb4b4b4>
Tb4b4b4<Tff7b72button
Te6edf3typeTff7b72=Ta5d6ff"button"
Te6edf3classTff7b72=Ta5d6ff"relative rounded-full p-1.5 sm:p-2 text-gray-600 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-zinc-800 transition-colors"
Tb4b4b4:Te6edf3titleTff7b72=Ta5d6ff"Te6edf3$tTb4b4b4(Ta5d6ff'app.language'Tb4b4b4)Ta5d6ff"
Tb4b4b4@Te6edf3clickTb4b4b4.Te6edf3stopTff7b72=Ta5d6ff"Te6edf3toggleDropdownTa5d6ff"
Tb4b4b4>
Tb4b4b4<Tff7b72MaterialDesignIcon Te6edf3icon-nameTff7b72=Ta5d6ff"translate" Te6edf3classTff7b72=Ta5d6ff"w-5 h-5 sm:w-6 sm:h-6" Tb4b4b4/Tb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72buttonTb4b4b4>
Tb4b4b4<Tff7b72Teleport Te6edf3toTff7b72=Ta5d6ff"body"Tb4b4b4>
Tb4b4b4<Tff7b72div
Te6edf3v-ifTff7b72=Ta5d6ff"Te6edf3isDropdownOpenTa5d6ff"
Te6edf3refTff7b72=Ta5d6ff"languageDropdown"
Te6edf3v-click-outsideTff7b72=Ta5d6ff"Te6edf3closeDropdownTa5d6ff"
Te6edf3classTff7b72=Ta5d6ff"fixed w-48 bg-white dark:bg-zinc-900 border border-gray-200 dark:border-zinc-800 rounded-2xl shadow-xl z-9999 overflow-x-hidden"
Tb4b4b4:Te6edf3styleTff7b72=Ta5d6ff"Te6edf3dropdownStyleTa5d6ff"
Tb4b4b4>
Tb4b4b4<Tff7b72div Te6edf3classTff7b72=Ta5d6ff"p-2"Tb4b4b4>
Tb4b4b4<Tff7b72button
Te6edf3v-forTff7b72=Ta5d6ff"Te6edf3lang Tff7b72in Te6edf3languagesTa5d6ff"
Tb4b4b4:Te6edf3keyTff7b72=Ta5d6ff"Te6edf3langTb4b4b4.Te6edf3codeTa5d6ff"
Te6edf3typeTff7b72=Ta5d6ff"button"
Te6edf3classTff7b72=Ta5d6ff"w-full px-4 py-2 text-left rounded-lg hover:bg-gray-100 dark:hover:bg-zinc-800 transition-colors flex items-center justify-between"
Tb4b4b4:Te6edf3classTff7b72=Ta5d6ff"Tb4b4b4{
Ta5d6ff'bg-blue-50 dark:bg-blue-900/20 text-blue-600 dark:text-blue-400'Tff7b72:
Te6edf3currentLanguage Tff7b72=== Te6edf3langTb4b4b4.Te6edf3codeTb4b4b4,
Ta5d6ff'text-gray-900 dark:text-zinc-100'Tff7b72: Te6edf3currentLanguage Tff7b72!== Te6edf3langTb4b4b4.Te6edf3codeTb4b4b4,
Tb4b4b4}Ta5d6ff"
Tb4b4b4@Te6edf3clickTff7b72=Ta5d6ff"Te6edf3selectLanguageTb4b4b4(Te6edf3langTb4b4b4.Te6edf3codeTb4b4b4)Ta5d6ff"
Tb4b4b4>
Tb4b4b4<Tff7b72span Te6edf3classTff7b72=Ta5d6ff"font-medium"Tb4b4b4>Tff7b72{{ Te6edf3langTb4b4b4.Te6edf3name Tff7b72}}Tb4b4b4<Tb4b4b4/Tff7b72spanTb4b4b4>
Tb4b4b4<Tff7b72MaterialDesignIcon Te6edf3v-ifTff7b72=Ta5d6ff"Te6edf3currentLanguage Tff7b72=== Te6edf3langTb4b4b4.Te6edf3codeTa5d6ff" Te6edf3icon-nameTff7b72=Ta5d6ff"check" Te6edf3classTff7b72=Ta5d6ff"w-5 h-5" Tb4b4b4/Tb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72buttonTb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72divTb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72divTb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72TeleportTb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72divTb4b4b4>
Tb4b4b4<Tb4b4b4/Tff7b72templateTb4b4b4>
Tb4b4b4<Tff7b72scriptTb4b4b4>
Tff7b72import Te6edf3MaterialDesignIcon Tff7b72from Ta5d6ff"./MaterialDesignIcon.vue"Tb4b4b4;
Tff7b72import Tb4b4b4{ Te6edf3clampFloatingToViewport Tb4b4b4} Tff7b72from Ta5d6ff"../js/clampFloatingToViewport.js"Tb4b4b4;
Tff7b72import Tb4b4b4{ Te6edf3ensureLocaleMessagesTb4b4b4, Te6edf3listLocaleCodes Tb4b4b4} Tff7b72from Ta5d6ff"../js/localeLoader.js"Tb4b4b4;
Tff7b72const Te6edf3LANGUAGE_NAMES Tff7b72= Tb4b4b4{
Te6edf3deTff7b72: Ta5d6ff"Deutsch"Tb4b4b4,
Te6edf3enTff7b72: Ta5d6ff"English"Tb4b4b4,
Te6edf3esTff7b72: Ta5d6ff"Español"Tb4b4b4,
Te6edf3fiTff7b72: Ta5d6ff"Suomi"Tb4b4b4,
Te6edf3frTff7b72: Ta5d6ff"Français"Tb4b4b4,
Te6edf3itTff7b72: Ta5d6ff"Italiano"Tb4b4b4,
Te6edf3nlTff7b72: Ta5d6ff"Nederlands"Tb4b4b4,
Te6edf3ruTff7b72: Ta5d6ff"Русский"Tb4b4b4,
Te6edf3zhTff7b72: Ta5d6ff"中文"Tb4b4b4,
Tb4b4b4}Tb4b4b4;
Tff7b72const Te6edf3discoveredLanguages Tff7b72= Te6edf3listLocaleCodesTb4b4b4(Tb4b4b4)Tb4b4b4.Te6edf3mapTb4b4b4(Tb4b4b4(Te6edf3codeTb4b4b4) Tb4b4b4=> Tb4b4b4(Tb4b4b4{
Te6edf3codeTb4b4b4,
Te6edf3nameTff7b72: Te6edf3LANGUAGE_NAMESTb4b4b4[Te6edf3codeTb4b4b4] Tff7b72|| Te6edf3codeTb4b4b4,
Tb4b4b4}Tb4b4b4)Tb4b4b4)Tb4b4b4;
Tff7b72export Tff7b72default Tb4b4b4{
Te6edf3nameTff7b72: Ta5d6ff"LanguageSelector"Tb4b4b4,
Te6edf3componentsTff7b72: Tb4b4b4{
Te6edf3MaterialDesignIconTb4b4b4,
Tb4b4b4}Tb4b4b4,
Te6edf3directivesTff7b72: Tb4b4b4{
Ta5d6ff"click-outside"Tff7b72: Tb4b4b4{
Te6edf3mountedTb4b4b4(Te6edf3elTb4b4b4, Te6edf3bindingTb4b4b4) Tb4b4b4{
Te6edf3elTb4b4b4.Te6edf3clickOutsideEvent Tff7b72= Tff7b72function Tb4b4b4(Te6edf3eventTb4b4b4) Tb4b4b4{
Tff7b72if Tb4b4b4(Tff7b72!Tb4b4b4(Te6edf3el Tff7b72=== Te6edf3eventTb4b4b4.Te6edf3target Tff7b72|| Te6edf3elTb4b4b4.Te6edf3containsTb4b4b4(Te6edf3eventTb4b4b4.Te6edf3targetTb4b4b4)Tb4b4b4)Tb4b4b4) Tb4b4b4{
Te6edf3bindingTb4b4b4.Te6edf3valueTb4b4b4(Tb4b4b4)Tb4b4b4;
Tb4b4b4}
Tb4b4b4}Tb4b4b4;
Tffa657documentTb4b4b4.Te6edf3addEventListenerTb4b4b4(Ta5d6ff"click"Tb4b4b4, Te6edf3elTb4b4b4.Te6edf3clickOutsideEventTb4b4b4)Tb4b4b4;
Tb4b4b4}Tb4b4b4,
Te6edf3unmountedTb4b4b4(Te6edf3elTb4b4b4) Tb4b4b4{
Tffa657documentTb4b4b4.Te6edf3removeEventListenerTb4b4b4(Ta5d6ff"click"Tb4b4b4, Te6edf3elTb4b4b4.Te6edf3clickOutsideEventTb4b4b4)Tb4b4b4;
Tb4b4b4}Tb4b4b4,
Tb4b4b4}Tb4b4b4,
Tb4b4b4}Tb4b4b4,
Te6edf3emitsTff7b72: Tb4b4b4[Ta5d6ff"language-change"Tb4b4b4]Tb4b4b4,
Te6edf3dataTb4b4b4(Tb4b4b4) Tb4b4b4{
Tff7b72return Tb4b4b4{
Te6edf3isDropdownOpenTff7b72: Tff7b72falseTb4b4b4,
Te6edf3dropdownPositionTff7b72: Tb4b4b4{ Te6edf3topTff7b72: T79c0ff0Tb4b4b4, Te6edf3leftTff7b72: T79c0ff0 Tb4b4b4}Tb4b4b4,
Te6edf3dropdownMaxHeightTff7b72: Tff7b72nullTb4b4b4,
Tb4b4b4}Tb4b4b4;
Tb4b4b4}Tb4b4b4,
Te6edf3computedTff7b72: Tb4b4b4{
Te6edf3currentLanguageTb4b4b4(Tb4b4b4) Tb4b4b4{
Tff7b72return Tff7b72thisTb4b4b4.Te6edf3$i18nTb4b4b4.Te6edf3localeTb4b4b4;
Tb4b4b4}Tb4b4b4,
Te6edf3languagesTb4b4b4(Tb4b4b4) Tb4b4b4{
Tff7b72return Te6edf3discoveredLanguagesTb4b4b4;
Tb4b4b4}Tb4b4b4,
Te6edf3dropdownStyleTb4b4b4(Tb4b4b4) Tb4b4b4{
Tff7b72const Te6edf3style Tff7b72= Tb4b4b4{
Te6edf3topTff7b72: Ta5d6ff`Tffd700${Tff7b72thisTb4b4b4.Te6edf3dropdownPositionTb4b4b4.Te6edf3topTffd700}Ta5d6ffpxTa5d6ff`Tb4b4b4,
Te6edf3leftTff7b72: Ta5d6ff`Tffd700${Tff7b72thisTb4b4b4.Te6edf3dropdownPositionTb4b4b4.Te6edf3leftTffd700}Ta5d6ffpxTa5d6ff`Tb4b4b4,
Tb4b4b4}Tb4b4b4;
Tff7b72if Tb4b4b4(Tff7b72thisTb4b4b4.Te6edf3dropdownMaxHeight Tff7b72!= Tff7b72nullTb4b4b4) Tb4b4b4{
Te6edf3styleTb4b4b4.Te6edf3maxHeight Tff7b72= Ta5d6ff`Tffd700${Tff7b72thisTb4b4b4.Te6edf3dropdownMaxHeightTffd700}Ta5d6ffpxTa5d6ff`Tb4b4b4;
Te6edf3styleTb4b4b4.Te6edf3overflowY Tff7b72= Ta5d6ff"auto"Tb4b4b4;
Tb4b4b4} Tff7b72else Tb4b4b4{
Te6edf3styleTb4b4b4.Te6edf3overflow Tff7b72= Ta5d6ff"hidden"Tb4b4b4;
Tb4b4b4}
Tff7b72return Te6edf3styleTb4b4b4;
Tb4b4b4}Tb4b4b4,
Tb4b4b4}Tb4b4b4,
Te6edf3methodsTff7b72: Tb4b4b4{
Te6edf3toggleDropdownTb4b4b4(Te6edf3eventTb4b4b4) Tb4b4b4{
Tff7b72thisTb4b4b4.Te6edf3isDropdownOpen Tff7b72= Tff7b72!Tff7b72thisTb4b4b4.Te6edf3isDropdownOpenTb4b4b4;
Tff7b72if Tb4b4b4(Tff7b72thisTb4b4b4.Te6edf3isDropdownOpenTb4b4b4) Tb4b4b4{
Tff7b72thisTb4b4b4.Te6edf3updateDropdownPositionTb4b4b4(Te6edf3eventTb4b4b4)Tb4b4b4;
Tb4b4b4}
Tb4b4b4}Tb4b4b4,
Te6edf3updateDropdownPositionTb4b4b4(Te6edf3eventTb4b4b4) Tb4b4b4{
Tff7b72const Te6edf3button Tff7b72= Te6edf3eventTb4b4b4.Te6edf3currentTargetTb4b4b4;
Tff7b72const Te6edf3rect Tff7b72= Te6edf3buttonTb4b4b4.Te6edf3getBoundingClientRectTb4b4b4(Tb4b4b4)Tb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3dropdownMaxHeight Tff7b72= Tff7b72nullTb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3dropdownPosition Tff7b72= Tb4b4b4{
Te6edf3topTff7b72: Te6edf3rectTb4b4b4.Te6edf3bottom Tff7b72+ T79c0ff8Tb4b4b4,
Te6edf3leftTff7b72: Tffa657MathTb4b4b4.Te6edf3maxTb4b4b4(T79c0ff8Tb4b4b4, Te6edf3rectTb4b4b4.Te6edf3right Tff7b72- T79c0ff192Tb4b4b4)Tb4b4b4,
Tb4b4b4}Tb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3$nextTickTb4b4b4(Tb4b4b4(Tb4b4b4) Tb4b4b4=> Tb4b4b4{
Tff7b72const Te6edf3panel Tff7b72= Tff7b72thisTb4b4b4.Te6edf3$refsTb4b4b4.Te6edf3languageDropdownTb4b4b4;
Tff7b72if Tb4b4b4(Tff7b72!Te6edf3panelTb4b4b4) Tff7b72returnTb4b4b4;
Tff7b72const Te6edf3pr Tff7b72= Te6edf3panelTb4b4b4.Te6edf3getBoundingClientRectTb4b4b4(Tb4b4b4)Tb4b4b4;
Tff7b72const Tb4b4b4{ Te6edf3leftTb4b4b4, Te6edf3topTb4b4b4, Te6edf3maxHeight Tb4b4b4} Tff7b72= Te6edf3clampFloatingToViewportTb4b4b4(Te6edf3prTb4b4b4.Te6edf3leftTb4b4b4, Te6edf3prTb4b4b4.Te6edf3topTb4b4b4, Te6edf3prTb4b4b4.Te6edf3widthTb4b4b4, Te6edf3prTb4b4b4.Te6edf3heightTb4b4b4)Tb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3dropdownPosition Tff7b72= Tb4b4b4{ Te6edf3leftTb4b4b4, Te6edf3top Tb4b4b4}Tb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3dropdownMaxHeight Tff7b72= Te6edf3maxHeightTb4b4b4;
Tb4b4b4}Tb4b4b4)Tb4b4b4;
Tb4b4b4}Tb4b4b4,
Te6edf3closeDropdownTb4b4b4(Tb4b4b4) Tb4b4b4{
Tff7b72thisTb4b4b4.Te6edf3isDropdownOpen Tff7b72= Tff7b72falseTb4b4b4;
Tb4b4b4}Tb4b4b4,
Tff7b72async Te6edf3selectLanguageTb4b4b4(Te6edf3langCodeTb4b4b4) Tb4b4b4{
Tff7b72if Tb4b4b4(Tff7b72thisTb4b4b4.Te6edf3currentLanguage Tff7b72=== Te6edf3langCodeTb4b4b4) Tb4b4b4{
Tff7b72thisTb4b4b4.Te6edf3closeDropdownTb4b4b4(Tb4b4b4)Tb4b4b4;
Tff7b72returnTb4b4b4;
Tb4b4b4}
Tff7b72try Tb4b4b4{
Tff7b72await Te6edf3ensureLocaleMessagesTb4b4b4(Tff7b72thisTb4b4b4.Te6edf3$i18nTb4b4b4, Te6edf3langCodeTb4b4b4)Tb4b4b4;
Tb4b4b4} Tff7b72catch Tb4b4b4{
T8b949e// Locale pack may be unavailable in tests or offline shells.
Tb4b4b4}
Tff7b72thisTb4b4b4.Te6edf3$emitTb4b4b4(Ta5d6ff"language-change"Tb4b4b4, Te6edf3langCodeTb4b4b4)Tb4b4b4;
Tff7b72thisTb4b4b4.Te6edf3closeDropdownTb4b4b4(Tb4b4b4)Tb4b4b4;
Tb4b4b4}Tb4b4b4,
Tb4b4b4}Tb4b4b4,
Tb4b4b4}Tb4b4b4;
Tb4b4b4<Tb4b4b4/Tff7b72scriptTb4b4b4>
──────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────